/* ==========================================================================
   Mobile 2000 Theme Custom Styles for Journal 3 (OpenCart 3)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&display=swap');

:root {
  --m2-primary: #0f2c4c;
  --m2-blue: #0072bc;
  --m2-accent: #00a8cc;
  --m2-cyan: #3fc1c9;
  --m2-bg-light: #f7f9fa;
  --m2-card-bg: #ffffff;
  --m2-border: #e6ebf0;
  --m2-text-dark: #1a202c;
  --m2-text-muted: #64748b;
  --m2-red: #e53935;
  --m2-radius: 16px;
  --m2-shadow: 0 4px 18px rgba(15, 44, 76, 0.06);
  --m2-shadow-hover: 0 10px 25px rgba(15, 44, 76, 0.12);
}

body,
html {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif;
  color: var(--m2-text-dark);
  background-color: #fbfcfd;
}

/* Ensure all icon fonts remain 100% intact across the entire website */
.fa,
[class*="fa-"],
[class^="fa-"],
[class*="icon-"],
[class^="icon-"],
.journal-icon,
[class*="revicon-"] {
  font-family: 'icomoon', 'FontAwesome', 'revicons' !important;
  font-style: normal;
}

/* ================= Full Width & Fluid Responsive Homepage Container ================= */
#mobile2000-home,
.m2-home-fluid,
#common-home,
.layout-top,
.layout-bottom,
.m2-native-products-wrap,
.m2-native-products-wrap .grid-row,
.m2-native-products-wrap .grid-cols,
.m2-native-products-wrap .grid-col,
.m2-native-products-wrap .module,
.m2-native-products-wrap .journal-carousel,
.m2-native-products-wrap .swiper-container,
.layout-top .grid-row,
.layout-top .grid-cols,
.layout-bottom .grid-row,
.layout-bottom .grid-cols,
.common-home .grid-cols,
.common-home .site-wrapper,
.common-home #container {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#mobile2000-home {
  padding-left: 30px !important;
  padding-right: 30px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Full Width Fluid Twenty Five Footer Container */
.tf-footer .container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  box-sizing: border-box !important;
}

@media (min-width: 1600px) {
  .tf-footer .container {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
}

@media (max-width: 1199px) {
  .tf-footer .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media (max-width: 768px) {
  .tf-footer .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (min-width: 1600px) {
  #mobile2000-home {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
}

@media (max-width: 1199px) {
  #mobile2000-home {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media (max-width: 768px) {
  #mobile2000-home {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (max-width: 480px) {
  #mobile2000-home {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .m2-feature-card {
    padding: 10px 10px;
    gap: 8px;
  }

  .m2-feature-icon {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }

  .m2-feature-title {
    font-size: 12px;
  }

  .m2-feature-sub {
    font-size: 10px;
  }
}

/* ================= Header & Menu Luxury Dark Theme (Matching Footer) ================= */
.site-wrapper .header-classic,
.site-wrapper .header-classic .mid-bar,
.site-wrapper .header-classic .top-bar,
.site-wrapper .header-classic .desktop-main-menu-wrapper,
.site-wrapper .header-classic .main-menu,
.site-wrapper .header-classic .j-menu,
.site-wrapper .header-classic .desktop-search-wrapper,
.site-wrapper .header-classic .desktop-cart-wrapper {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
}

/* Base Header Background: Unified, seamless luxury dark navy */
header,
header.header-classic,
.site-wrapper header,
.site-wrapper .header-classic,
.site-wrapper .header-classic .top-bar,
.site-wrapper .header-classic .mid-bar,
.site-wrapper .header-classic .desktop-main-menu-wrapper {
  background: #0d2137 !important;
  background-color: #0d2137 !important;
  background-image: none !important;
}

/* ================= 1. Top Bar: Links on Right, Language/Currency on Left ================= */
.site-wrapper .header-classic .top-bar,
.site-wrapper .m2-top-bar {
  background: #0d2137 !important;
  color: #94a3b8 !important;
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  padding: 0 28px !important;
  font-weight: 600 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  box-sizing: border-box !important;
}

/* 1.1 Top Menu Links: Right in RTL (الرئيسية، من نحن، اتصل بنا) with Cairo Font & Larger Size */
html[dir="rtl"] .site-wrapper .header-classic .top-bar .top-bar-links-wrapper,
.site-wrapper .header-classic .top-bar .top-bar-links-wrapper,
.site-wrapper .header-classic .top-bar .top-menu {
  order: 1 !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
}

.site-wrapper .header-classic .top-bar .top-menu>ul,
.site-wrapper .m2-top-bar ul {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.site-wrapper .header-classic .top-bar a,
.site-wrapper .header-classic .top-bar a *,
.site-wrapper .header-classic .top-bar .top-menu>ul>li>a,
.site-wrapper .header-classic .top-bar .top-bar-links-wrapper .links-text,
.site-wrapper .m2-top-bar a {
  color: #e2e8f0 !important;
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.site-wrapper .header-classic .top-bar a {
  padding: 4px 10px !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.site-wrapper .header-classic .top-bar a:hover,
.site-wrapper .header-classic .top-bar a:hover *,
.site-wrapper .header-classic .top-bar .top-menu>ul>li>a:hover,
.site-wrapper .m2-top-bar a:hover {
  color: #38bdf8 !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* 1.2 Language and Currency: Pushed to the FAR LEFT with Cairo Font & Larger Size */
html[dir="rtl"] .site-wrapper .header-classic .top-bar .language-currency,
.site-wrapper .header-classic .top-bar .language-currency {
  order: 2 !important;
  margin-right: auto !important;
  margin-left: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

html[dir="ltr"] .site-wrapper .header-classic .top-bar .language-currency {
  margin-left: auto !important;
  margin-right: 0 !important;
}

.site-wrapper .header-classic .desktop-language-wrapper,
.site-wrapper .header-classic .desktop-currency-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

/* Hide external Journal3 arrow outside the button frame */
.site-wrapper .header-classic .language-currency .dropdown::after,
.site-wrapper .header-classic .language-currency .drop-menu::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Active Trigger Buttons ONLY - Arrow INSIDE the Frame */
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle,
.site-wrapper .header-classic .language-currency .dropdown>.btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  height: 28px !important;
  min-height: 28px !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  box-shadow: none !important;
  line-height: 1 !important;
  transition: all 0.2s ease !important;
}

/* Arrow inside the button */
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle::after {
  content: "\f0d7" !important;
  font-family: 'FontAwesome' !important;
  font-size: 10px !important;
  color: #cbd5e1 !important;
  display: inline-block !important;
  margin-right: 3px !important;
  margin-left: 2px !important;
  vertical-align: middle !important;
  transition: transform 0.2s ease, color 0.2s ease !important;
}

.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle:hover::after {
  color: #38bdf8 !important;
}

.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle:hover,
.site-wrapper .header-classic .language-currency .dropdown>.btn:hover {
  background: rgba(0, 114, 188, 0.28) !important;
  border-color: #0072bc !important;
  color: #38bdf8 !important;
}

/* Active Text Only on the Closed Button (Cairo & White) */
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle .language-title,
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle .currency-symbol,
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle .currency-title,
.site-wrapper .header-classic .language-currency .dropdown>button.dropdown-toggle .currency-code {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

/* Fix Flag Image Dimensions everywhere so it never stretches or breaks */
.site-wrapper .header-classic .language-flag,
.site-wrapper .header-classic .language-flag img,
.site-wrapper .header-classic .symbol,
.site-wrapper .header-classic .symbol img,
.site-wrapper .header-classic .language-dropdown img,
.site-wrapper .header-classic #language img {
  width: 16px !important;
  height: 11px !important;
  max-width: 16px !important;
  max-height: 11px !important;
  min-width: 16px !important;
  min-height: 11px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  object-fit: contain !important;
  margin: 0 3px !important;
  padding: 0 !important;
  border: none !important;
  flex: 0 0 16px !important;
}

/* Pure White Dropdown Container with Soft Shadow & 8px Radius */
.site-wrapper .header-classic .language-currency .dropdown-menu,
.site-wrapper .header-classic .language-currency .j-dropdown {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15), 0 4px 6px rgba(0, 0, 0, 0.05) !important;
  padding: 6px 0 !important;
  min-width: 150px !important;
  z-index: 1000 !important;
}

.site-wrapper .header-classic .language-currency .dropdown-menu li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* All Items & Text inside the Open Dropdown Menu MUST BE DARK (Never White!) */
.site-wrapper .header-classic .language-currency .dropdown-menu a,
.site-wrapper .header-classic .language-currency .dropdown-menu button,
.site-wrapper .header-classic .language-currency .dropdown-menu span,
.site-wrapper .header-classic .language-currency .dropdown-menu b,
.site-wrapper .header-classic .language-currency .dropdown-menu .language-title-dropdown,
.site-wrapper .header-classic .language-currency .dropdown-menu .currency-title-dropdown,
.site-wrapper .header-classic .language-currency .dropdown-menu .currency-symbol,
.site-wrapper .header-classic .language-currency .dropdown-menu .currency-code-dropdown,
.site-wrapper .header-classic #currency .dropdown-menu *,
.site-wrapper .header-classic #language .dropdown-menu * {
  color: #1e293b !important;
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.site-wrapper .header-classic .language-currency .dropdown-menu a,
.site-wrapper .header-classic .language-currency .dropdown-menu button {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 14px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  background: transparent !important;
  border: none !important;
  width: 100% !important;
  text-align: right !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

.site-wrapper .header-classic .language-currency .dropdown-menu a:hover,
.site-wrapper .header-classic .language-currency .dropdown-menu button:hover,
.site-wrapper .header-classic #currency .dropdown-menu a:hover,
.site-wrapper .header-classic #language .dropdown-menu a:hover {
  background: #f1f5f9 !important;
  color: #0072bc !important;
}

.site-wrapper .header-classic .language-currency .dropdown-menu a:hover *,
.site-wrapper .header-classic .language-currency .dropdown-menu button:hover *,
.site-wrapper .header-classic #currency .dropdown-menu a:hover *,
.site-wrapper .header-classic #language .dropdown-menu a:hover * {
  color: #0072bc !important;
}

/* Hide Privacy & Cookie Notice Banner Completely */
.notice-module,
.module-header_notice,
.module-layout_notice,
.header-notice,
.layout-notice,
.cookie-notice,
.gdpr-notice,
.header-notice-close-button {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ================= 2. Mid Bar (Logo on Right, Search in Center, Cart & Icons on Left) ================= */
.site-wrapper .header-classic .mid-bar {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 0 16px !important;
  background: #0d2137 !important;
  background-color: #0d2137 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  height: 68px !important;
  min-height: 68px !important;
  max-height: 68px !important;
  box-sizing: border-box !important;
  gap: 16px !important;
  overflow: visible !important;
}

/* 2.1 Logo: Exactly like footer logo (max-width: 175px, height: auto, border-radius: 6px) */
html[dir="rtl"] .site-wrapper .header-classic .mid-bar .desktop-logo-wrapper,
.site-wrapper .header-classic .mid-bar .desktop-logo-wrapper {
  order: 1 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[dir="ltr"] .site-wrapper .header-classic .mid-bar .desktop-logo-wrapper {
  margin: 0 !important;
  padding: 0 !important;
}

.site-wrapper .header-classic .mid-bar #logo,
html[dir="rtl"] .site-wrapper .header-classic .mid-bar #logo,
.desktop-header-active .header-classic #logo {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

.site-wrapper .header-classic .mid-bar #logo a,
.desktop-header-active .header-classic #logo a {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Logo Image: Exactly identical to .tf-footer-site-logo */
.site-wrapper .header-classic .mid-bar #logo img,
.site-wrapper .header-classic .mid-bar #logo a>img,
.site-wrapper .header-classic #logo img,
.desktop-header-active .header-classic #logo a>img,
#logo a>img {
  width: 200px !important;
  max-width: 210px !important;
  height: auto !important;
  display: block !important;
  border-radius: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  filter: none !important;
  position: relative !important;
  transform: translate(-41px, -20px) !important;
  /* تحريك لأعلى ولليسار بدون التأثير على أي عنصر آخر */
}

html[dir="ltr"] .site-wrapper .header-classic .mid-bar #logo img,
html[dir="ltr"] .site-wrapper .header-classic .mid-bar #logo a>img {
  object-position: center !important;
  transform-origin: center !important;
}

/* 2.2 Search Bar: In the Exact Center, 8px Radius */
.site-wrapper .header-classic .desktop-search-wrapper {
  order: 2 !important;
  flex: 1 1 500px !important;
  max-width: 620px !important;
  margin: 0 auto !important;
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
  position: relative !important;
  align-self: center !important;
  box-sizing: border-box !important;
}

/* Hide unused search trigger in full-search desktop header */
.site-wrapper .header-classic .desktop-search-wrapper .search-trigger,
.site-wrapper .header-classic #search>.search-trigger,
.site-wrapper .header-classic #search>button.search-trigger {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* Search Outer Container: 8px Border-Radius */
.site-wrapper .header-classic #search,
.site-wrapper .header-classic .desktop-search-wrapper #search {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 42px !important;
  max-height: 42px !important;
  background: #11253a !important;
  border: 1.5px solid #1f3b5c !important;
  border-radius: 8px !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2) !important;
  transition: all 0.25s ease !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.site-wrapper .header-classic #search:focus-within,
.site-wrapper .header-classic .desktop-search-wrapper #search:focus-within {
  border-color: #0072bc !important;
  background: #152d47 !important;
  box-shadow: 0 0 0 3px rgba(0, 114, 188, 0.25), inset 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

/* Search Inner Dropdown / Wrapper */
.site-wrapper .header-classic #search>.dropdown-menu,
.site-wrapper .header-classic #search>.j-dropdown {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  transform: none !important;
  display: flex !important;
  align-items: center !important;
  opacity: 1 !important;
  visibility: visible !important;
  border-radius: 8px !important;
  overflow: visible !important;
}

/* Inner Search Row */
.site-wrapper .header-classic .header-search {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  position: relative !important;
  overflow: visible !important;
}

/* Twitter Typeahead Wrapper */
.site-wrapper .header-classic .header-search>span,
.site-wrapper .header-classic .header-search .twitter-typeahead {
  flex: 1 1 auto !important;
  height: 100% !important;
  width: auto !important;
  display: flex !important;
  align-items: center !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Search Input Text Field: 8px border radius on right side in RTL */
html[dir="rtl"] .site-wrapper .header-classic .header-search input,
html[dir="rtl"] .site-wrapper .header-classic .header-search input[name="search"],
html[dir="rtl"] .site-wrapper .header-classic .header-search .search-input,
html[dir="rtl"] .site-wrapper .header-classic .header-search .tt-input,
.site-wrapper .header-classic .header-search input {
  width: 100% !important;
  height: 100% !important;
  min-height: 40px !important;
  line-height: 40px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 16px !important;
  color: #ffffff !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  outline: none !important;
  margin: 0 !important;
  vertical-align: middle !important;
  text-align: right !important;
  box-sizing: border-box !important;
  border-radius: 0 8px 8px 0 !important;
}

html[dir="ltr"] .site-wrapper .header-classic .header-search input {
  text-align: left !important;
  border-radius: 8px 0 0 8px !important;
}

.site-wrapper .header-classic .header-search input::placeholder,
.site-wrapper .header-classic #search input::placeholder {
  color: #8fa0b5 !important;
  font-size: 12.5px !important;
  opacity: 1 !important;
}

/* Search Button: 8px radius on button side */
html[dir="rtl"] .site-wrapper .header-classic .header-search .search-button,
html[dir="rtl"] .site-wrapper .header-classic .header-search button,
html[dir="rtl"] .site-wrapper .header-classic #search .search-button,
.site-wrapper .header-classic .header-search .search-button {
  width: 48px !important;
  height: 100% !important;
  min-height: 40px !important;
  background: linear-gradient(135deg, #0072bc, #0284c7) !important;
  border: none !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 0 0 48px !important;
  border-radius: 8px 0 0 8px !important;
  box-sizing: border-box !important;
}

html[dir="ltr"] .site-wrapper .header-classic .header-search .search-button {
  border-radius: 0 8px 8px 0 !important;
}

.site-wrapper .header-classic .header-search .search-button:hover,
.site-wrapper .header-classic .header-search button:hover,
.site-wrapper .header-classic #search .search-button:hover {
  background: linear-gradient(135deg, #0284c7, #38bdf8) !important;
}

.site-wrapper .header-classic .header-search .search-button::before,
.site-wrapper .header-classic #search .search-button::before {
  content: "\f002" !important;
  font-family: 'FontAwesome' !important;
  font-size: 16px !important;
  color: #ffffff !important;
  line-height: 1 !important;
  display: block !important;
  margin: 0 auto !important;
}

.site-wrapper .header-classic #search .search-button i {
  color: #ffffff !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

/* Search Autocomplete Typeahead Dropdown Menu (.tt-menu) */
.site-wrapper .header-classic .tt-menu,
.site-wrapper .header-classic #search .tt-menu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin-top: 6px !important;
  background: #0d2137 !important;
  border: 1px solid #1f3b5c !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
  padding: 8px 0 !important;
  z-index: 9999 !important;
  max-height: 380px !important;
  overflow-y: auto !important;
  width: 100% !important;
}

.site-wrapper .header-classic .tt-suggestion,
.site-wrapper .header-classic #search .tt-suggestion {
  padding: 8px 16px !important;
  color: #e2e8f0 !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-align: right !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.site-wrapper .header-classic .tt-suggestion:hover,
.site-wrapper .header-classic .tt-suggestion.tt-cursor {
  background: #152d47 !important;
  color: #38bdf8 !important;
}

/* 2.3 Actions: Account, Wishlist, Compare & Cart (Left in RTL) */
.site-wrapper .header-classic .classic-cart-wrapper {
  order: 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* Secondary menu items (Login/Account, Wishlist, Compare) - Premium Action Buttons */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu>.menu-item {
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

/* Top-level Menu Button: Sleek Luxury Glass (مع مسافة داخلية مريحة للإشعار بعد النص) */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item>a,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu>.menu-item>a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  width: auto !important;
  padding: 0 14px 0 44px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  cursor: pointer !important;
  position: relative !important;
  box-sizing: border-box !important;
}

html[dir="ltr"] .site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item>a,
html[dir="ltr"] .site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu>.menu-item>a {
  padding: 0 44px 0 14px !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item>a:hover,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu>.menu-item>a:hover {
  background: rgba(0, 168, 204, 0.22) !important;
  border-color: #00a8cc !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(0, 168, 204, 0.28) !important;
}

/* Crystal Clear Arabic Labels */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item>a .links-text,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu>.j-menu>.menu-item>a .links-text {
  display: inline-block !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  letter-spacing: 0.1px !important;
}

/* Distinct Vibrant Action Icons on the Right */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item a[href*="account"]::before,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu-item-1>a::before {
  content: "\f007" !important;
  font-family: 'FontAwesome' !important;
  font-size: 14px !important;
  color: #38bdf8 !important;
  margin: 0 !important;
  display: inline-block !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item a[href*="wishlist"]::before,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu-item-5>a::before {
  content: "\f004" !important;
  font-family: 'FontAwesome' !important;
  font-size: 14px !important;
  color: #f43f5e !important;
  margin: 0 !important;
  display: inline-block !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu>.j-menu>.menu-item a[href*="compare"]::before,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .top-menu-item-6>a::before {
  content: "\f021" !important;
  font-family: 'FontAwesome' !important;
  font-size: 14px !important;
  color: #34d399 !important;
  margin: 0 !important;
  display: inline-block !important;
}

/* Action Buttons (Login, Wishlist, Compare, Cart) - Room inside the button for badge */
.site-wrapper .classic-cart-wrapper .secondary-menu a,
.site-wrapper .classic-cart-wrapper .top-menu a,
.classic-cart-wrapper .secondary-menu li,
.classic-cart-wrapper .secondary-menu a,
.classic-cart-wrapper .top-menu li,
.classic-cart-wrapper .top-menu a,
.site-wrapper .header-classic #cart .btn,
.site-wrapper .header-classic #cart .cart-heading,
.site-wrapper .header-classic .desktop-cart-wrapper .cart-heading {
  padding-left: 44px !important;
  padding-right: 14px !important;
  position: relative !important;
}

html[dir="ltr"] .site-wrapper .classic-cart-wrapper .secondary-menu a,
html[dir="ltr"] .site-wrapper .classic-cart-wrapper .top-menu a,
html[dir="ltr"] .classic-cart-wrapper .secondary-menu a,
html[dir="ltr"] .classic-cart-wrapper .top-menu a,
html[dir="ltr"] .site-wrapper .header-classic #cart .btn,
html[dir="ltr"] .site-wrapper .header-classic #cart .cart-heading,
html[dir="ltr"] .site-wrapper .header-classic .desktop-cart-wrapper .cart-heading {
  padding-right: 44px !important;
  padding-left: 14px !important;
}

/* 1. إخفاء الإشعار تماماً لو القيمة صفر (0) في السلة والرغبات والمقارنة */
.count-badge.count-zero,
#cart .count-badge.count-zero,
#cart-items.count-zero,
.classic-cart-wrapper .secondary-menu .count-badge.count-zero,
.classic-cart-wrapper .top-menu .count-badge.count-zero,
.site-wrapper .secondary-menu .count-badge.count-zero,
.secondary-menu .count-badge.count-zero,
.mobile-bar .count-badge.count-zero {
  display: none !important;
}

/* 2. موضع الإشعار داخل الأزرار (الرغبات، المقارنة، والسلة) - بداخل الزر موسط رأسياً وداخل الإطار بمسافة مريحة */
#cart .count-badge,
#cart .cart-badge,
#cart #cart-items,
.classic-cart-wrapper .secondary-menu .count-badge,
.classic-cart-wrapper .top-menu .count-badge,
.site-wrapper .secondary-menu .count-badge,
.secondary-menu .count-badge,
.mobile-bar .mobile-custom-menu .count-badge {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  left: 10px !important;
  /* <--- يرجع لورا داخل الزرار بعيداً عن الإطار بـ 10 بكسل */
  right: auto !important;
  background: #ef4444 !important;
  color: #ffffff !important;
  min-width: 18px !important;
  height: 18px !important;
  line-height: 18px !important;
  border-radius: 9px !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 4px !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  z-index: 5 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

html[dir="ltr"] #cart .count-badge,
html[dir="ltr"] #cart .cart-badge,
html[dir="ltr"] #cart #cart-items,
html[dir="ltr"] .classic-cart-wrapper .secondary-menu .count-badge,
html[dir="ltr"] .classic-cart-wrapper .top-menu .count-badge,
html[dir="ltr"] .site-wrapper .secondary-menu .count-badge,
html[dir="ltr"] .secondary-menu .count-badge,
html[dir="ltr"] .mobile-bar .mobile-custom-menu .count-badge {
  left: auto !important;
  right: 10px !important;
}

/* ================= Account Dropdown Menu ================= */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu.j-dropdown,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .open>.dropdown-menu,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .open>.j-dropdown {
  position: absolute !important;
  top: 100% !important;
  right: 0 !important;
  left: auto !important;
  margin-top: 6px !important;
  min-width: 180px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.06) !important;
  padding: 6px 0 !important;
  z-index: 1000 !important;
  opacity: 1 !important;
  display: none;
  overflow: visible !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .open>.dropdown-menu,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .open>.j-dropdown {
  display: block !important;
}

html[dir="ltr"] .site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu.j-dropdown,
html[dir="ltr"] .site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .open>.dropdown-menu {
  right: auto !important;
  left: 0 !important;
}

/* Remove default triangular arrow pointer */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu::before,
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .j-dropdown::before {
  display: none !important;
}

/* Dropdown list container */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  width: 100% !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

/* Clean Dropdown Links */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item>a {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: auto !important;
  min-height: 36px !important;
  max-height: none !important;
  padding: 8px 14px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #f1f5f9 !important;
  border-radius: 0 !important;
  color: #1e293b !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: right !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background 0.15s ease, color 0.15s ease !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item:last-child>a {
  border-bottom: none !important;
}

.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item>a:hover {
  background: #f0f7ff !important;
  color: #0072bc !important;
}

/* Dropdown Links Text */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item>a .links-text {
  display: inline !important;
  color: inherit !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove icon inheritance inside dropdown items */
.site-wrapper .header-classic .classic-cart-wrapper .secondary-menu .dropdown-menu .j-menu>.menu-item>a::before {
  display: none !important;
}

/* ================= Premium Shopping Cart Button (Matches Family) ================= */
.site-wrapper .header-classic .classic-cart-wrapper .desktop-cart-wrapper,
.site-wrapper .header-classic .classic-cart-wrapper #cart,
.site-wrapper .header-classic .desktop-cart-wrapper,
.site-wrapper .header-classic #cart {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
  position: relative !important;
}

.site-wrapper .header-classic #cart .btn,
.site-wrapper .header-classic #cart .cart-heading,
.site-wrapper .header-classic .desktop-cart-wrapper .cart-heading {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  width: auto !important;
  padding: 0 14px 0 44px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  cursor: pointer !important;
  position: relative !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}

html[dir="ltr"] .site-wrapper .header-classic #cart .cart-heading {
  padding: 0 44px 0 14px !important;
}

.site-wrapper .header-classic #cart .btn:hover,
.site-wrapper .header-classic #cart .cart-heading:hover,
.site-wrapper .header-classic .desktop-cart-wrapper .cart-heading:hover {
  background: rgba(0, 168, 204, 0.22) !important;
  border-color: #00a8cc !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(0, 168, 204, 0.28) !important;
}

.site-wrapper .header-classic #cart .cart-heading::before,
.site-wrapper .header-classic #cart .btn::before,
.site-wrapper .header-classic #cart .cart-label {
  display: none !important;
  content: none !important;
}

/* Shopping Cart Icon (Gold / Amber, centered, scaled down and proportional) */
.site-wrapper .header-classic #cart .cart-heading i,
.site-wrapper .header-classic #cart .btn i,
.site-wrapper .header-classic #cart i.fa-shopping-cart,
.site-wrapper .header-classic #cart .cart-icon {
  order: 1 !important;
  font-size: 11px !important;
  width: auto !important;
  height: auto !important;
  color: #fbbf24 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

.site-wrapper .header-classic #cart .cart-heading i::before,
.site-wrapper .header-classic #cart .btn i::before,
.site-wrapper .header-classic #cart i.fa-shopping-cart::before {
  font-size: 11px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Show "عربة التسوق" via #cart-total element */
.site-wrapper .header-classic #cart #cart-total {
  order: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.site-wrapper .header-classic #cart #cart-total::after {
  content: "عربة التسوق" !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  white-space: nowrap !important;
  letter-spacing: 0.1px !important;
  line-height: 1 !important;
  display: inline-block !important;
}

.site-wrapper .header-classic #cart .cart-heading::after {
  display: none !important;
}

/* ================= Shopping Cart Dropdown Menu ================= */
.site-wrapper .header-classic #cart #cart-content.dropdown-menu,
.site-wrapper .header-classic #cart.open #cart-content {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.06) !important;
  padding: 10px !important;
  z-index: 1000 !important;
  color: #1e293b !important;
  min-width: 280px !important;
  margin-top: 10px !important;
}

.site-wrapper .header-classic #cart #cart-content * {
  font-family: 'Cairo', sans-serif !important;
}

.site-wrapper .header-classic #cart #cart-content a {
  color: #1e293b !important;
}

.site-wrapper .header-classic #cart #cart-content a:hover {
  color: #0072bc !important;
}

.site-wrapper .header-classic #cart #cart-content .cart-buttons .btn-cart {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border-radius: 6px !important;
}

.site-wrapper .header-classic #cart #cart-content .cart-buttons .btn-checkout {
  background: #0072bc !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}

/* ================= 3. Desktop Main Menu Navigation Bar ================= */
.site-wrapper .header-classic .desktop-main-menu-wrapper {
  background: #0d2137 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-bottom: 2px solid #0072bc !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
  position: relative !important;
  top: 0 !important;
  height: 50px !important;
  min-height: 50px !important;
  max-height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 15px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* Override Journal3 dynamic CSS that sets top:-50px on menu wrapper */
.desktop-main-menu-wrapper,
.desktop-header-active .desktop-main-menu-wrapper,
.header-classic .desktop-main-menu-wrapper,
.desktop-header-active .header-classic .desktop-main-menu-wrapper {
  top: 0 !important;
  margin-top: 0 !important;
}

/* Top-level menu bars inside the header */
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu>.j-menu {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  flex-wrap: nowrap !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu>.j-menu>.menu-item {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* 3.1 "كل الأقسام" ONLY - Distinctive Button (Only in the first menu) */
.site-wrapper .header-classic .desktop-main-menu-wrapper>#main-menu>.j-menu>.menu-item:first-child>a,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu:first-child>.j-menu>.menu-item:first-child>a,
.site-wrapper .header-classic .desktop-main-menu-wrapper .menu-item-departments>a {
  background: linear-gradient(135deg, #0072bc 0%, #00a8cc 100%) !important;
  color: #ffffff !important;
  font-family: 'Cairo', sans-serif !important;
  font-weight: 800 !important;
  font-size: 13.5px !important;
  height: 36px !important;
  line-height: 36px !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  margin: 0 8px 0 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-shadow: 0 3px 10px rgba(0, 114, 188, 0.4) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  border: none !important;
  box-sizing: border-box !important;
  align-self: center !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper>#main-menu>.j-menu>.menu-item:first-child>a::before,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu:first-child>.j-menu>.menu-item:first-child>a::before,
.site-wrapper .header-classic .desktop-main-menu-wrapper .menu-item-departments>a::before {
  content: "\f0c9" !important;
  font-family: 'FontAwesome', 'icomoon' !important;
  font-size: 14px !important;
  font-weight: normal !important;
  color: #ffffff !important;
  margin-left: 6px !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper>#main-menu>.j-menu>.menu-item:first-child>a:hover,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu:first-child>.j-menu>.menu-item:first-child>a:hover,
.site-wrapper .header-classic .desktop-main-menu-wrapper .menu-item-departments>a:hover {
  background: linear-gradient(135deg, #005f9e 0%, #0095b5 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 15px rgba(0, 114, 188, 0.55) !important;
  transform: translateY(-1px) !important;
}

/* 3.2 Second Menu (المنيو التاني) & General Navigation Items: Plain text only, NO buttons */
.site-wrapper .header-classic .desktop-main-menu-wrapper .main-menu+.main-menu>.j-menu>.menu-item>a,
.site-wrapper .header-classic .desktop-main-menu-wrapper #main-menu-2>.j-menu>.menu-item>a,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu>.j-menu>.menu-item:not(:first-child)>a {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  padding: 0 14px !important;
  line-height: 50px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  border: none !important;
  box-sizing: border-box !important;
  align-self: center !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper .main-menu+.main-menu>.j-menu>.menu-item>a::before,
.site-wrapper .header-classic .desktop-main-menu-wrapper #main-menu-2>.j-menu>.menu-item>a::before,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu>.j-menu>.menu-item:not(:first-child)>a::before {
  content: none !important;
  display: none !important;
}

.site-wrapper .header-classic .desktop-main-menu-wrapper .main-menu+.main-menu>.j-menu>.menu-item>a:hover,
.site-wrapper .header-classic .desktop-main-menu-wrapper #main-menu-2>.j-menu>.menu-item>a:hover,
.site-wrapper .header-classic .desktop-main-menu-wrapper>.main-menu>.j-menu>.menu-item:not(:first-child)>a:hover {
  color: #3fc1c9 !important;
  background: rgba(255, 255, 255, 0.06) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Push second menu to the other side */
html[dir='rtl'] .site-wrapper .header-classic .desktop-main-menu-wrapper .main-menu+.main-menu,
html[dir='rtl'] .site-wrapper .header-classic .desktop-main-menu-wrapper #main-menu-2 {
  margin-right: auto !important;
}

html[dir='ltr'] .site-wrapper .header-classic .desktop-main-menu-wrapper .main-menu+.main-menu,
html[dir='ltr'] .site-wrapper .header-classic .desktop-main-menu-wrapper #main-menu-2 {
  margin-left: auto !important;
}

/* ================= 3.3 Main Menu Dropdowns & Mega Menus (ماركات، الأقسام، إلخ) ================= */
/* 1. Reset Top-Level Menu Items: "ماركات" and all navigation links are plain text with NO borders and NO frames */
.site-wrapper .desktop-main-menu-wrapper .main-menu>.j-menu>.menu-item.mega-menu,
.site-wrapper .desktop-main-menu-wrapper .main-menu>.j-menu>.menu-item.mega-menu>a,
.site-wrapper .desktop-main-menu-wrapper .main-menu>.j-menu>.menu-item:not(:first-child),
.site-wrapper .desktop-main-menu-wrapper .main-menu>.j-menu>.menu-item:not(:first-child)>a {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* 2. Dropdown Container & Mega Menu Content: Solid Clean White Background (#ffffff) */
.site-wrapper .desktop-main-menu-wrapper .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .mega-menu-content,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .mega-menu-content,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .module-manufacturers,
.site-wrapper .desktop-main-menu-wrapper .module-manufacturers {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: none !important;
  outline: none !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
  border-radius: 0 !important;
}

/* Primary Top-Level Navigation Dropdowns: Flush below header bar at top: 100% */
.site-wrapper .desktop-main-menu-wrapper .main-menu > .j-menu > .menu-item > .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .main-menu > .j-menu > .menu-item > .j-dropdown {
  top: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  transform: none !important;
}

/* Flyout Submenus (Inside "كل الأقسام" e.g. "ماركات" and other categories): Perfectly aligned at the same level (top: 0) */
.site-wrapper .desktop-main-menu-wrapper .flyout-menu .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .flyout-menu-item .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .flyout-menu .mega-menu .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .flyout-menu .mega-menu > .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .dropdown-menu .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .dropdown-menu .j-dropdown,
.site-wrapper .desktop-main-menu-wrapper .menu-item.flyout-menu-item > .dropdown-menu,
.site-wrapper .desktop-main-menu-wrapper .j-menu > .menu-item > .dropdown-menu .menu-item > .dropdown-menu {
  top: 0 !important;
  margin-top: 0 !important;
  transform: none !important;
}

html[dir="rtl"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu .menu-item .j-dropdown,
html[dir="rtl"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .dropdown-menu,
html[dir="rtl"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .j-dropdown,
html[dir="rtl"] .site-wrapper .desktop-main-menu-wrapper .dropdown-menu .dropdown-menu {
  right: 100% !important;
  left: auto !important;
}

html[dir="ltr"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu .menu-item .j-dropdown,
html[dir="ltr"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .dropdown-menu,
html[dir="ltr"] .site-wrapper .desktop-main-menu-wrapper .flyout-menu-item > .j-dropdown,
html[dir="ltr"] .site-wrapper .desktop-main-menu-wrapper .dropdown-menu .dropdown-menu {
  left: 100% !important;
  right: auto !important;
}

/* Remove arrows and pseudo-elements that create dark gaps */
.site-wrapper .desktop-main-menu-wrapper .j-dropdown::before,
.site-wrapper .desktop-main-menu-wrapper .j-dropdown::after,
.site-wrapper .desktop-main-menu-wrapper .dropdown-menu::before,
.site-wrapper .desktop-main-menu-wrapper .dropdown-menu::after {
  display: none !important;
  content: none !important;
  border: none !important;
}

/* 3. Strip ALL borders, outlines, shadows, and frames from inner mega-menu elements without breaking white background */
.site-wrapper .desktop-main-menu-wrapper .module-catalog,
.site-wrapper .desktop-main-menu-wrapper .module-catalog .module-body,
.site-wrapper .desktop-main-menu-wrapper .manufacturer-grid,
.site-wrapper .desktop-main-menu-wrapper .category-grid,
.site-wrapper .desktop-main-menu-wrapper .manufacturer-layout,
.site-wrapper .desktop-main-menu-wrapper .manufacturer-thumb,
.site-wrapper .desktop-main-menu-wrapper .category-thumb {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* 4. Brand Images: Clean display */
.site-wrapper .desktop-main-menu-wrapper .mega-menu img,
.site-wrapper .desktop-main-menu-wrapper .mega-menu-content img,
.site-wrapper .desktop-main-menu-wrapper .manufacturer-thumb img,
.site-wrapper .desktop-main-menu-wrapper .catalog-image img,
.site-wrapper .desktop-main-menu-wrapper .category-thumb img {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  border: none !important;
  box-shadow: none !important;
}

.site-wrapper .desktop-main-menu-wrapper .mega-menu .name a,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .caption a,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .title,
.site-wrapper .desktop-main-menu-wrapper .mega-menu .catalog-title {
  color: #1e293b !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: center !important;
  border: none !important;
}

/* 3. Simple Text Submenus (Vertical flyout lists) */
.site-wrapper .desktop-main-menu-wrapper .flyout-menu .j-menu,
.site-wrapper .desktop-main-menu-wrapper .j-dropdown:not(.mega-menu) .j-menu {
  display: block !important;
  width: auto !important;
  min-width: 200px !important;
  padding: 6px !important;
  margin: 0 !important;
  background: #ffffff !important;
}

.site-wrapper .desktop-main-menu-wrapper .flyout-menu .j-menu>.menu-item>a,
.site-wrapper .desktop-main-menu-wrapper .j-dropdown:not(.mega-menu) .j-menu>.menu-item>a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 14px !important;
  color: #1e293b !important;
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  background: transparent !important;
}

.site-wrapper .desktop-main-menu-wrapper .flyout-menu .j-menu>.menu-item>a:hover,
.site-wrapper .desktop-main-menu-wrapper .j-dropdown:not(.mega-menu) .j-menu>.menu-item>a:hover {
  background: #f0f7ff !important;
  color: #0072bc !important;
}

/* 4. Completely eliminate dark site backdrops and black shadows on menu hover */
body.menu-open::before,
body.menu-open::after,
.menu-open::before,
.menu-open::after,
.site-wrapper.menu-open::before,
.site-wrapper.menu-open::after,
.desktop-main-menu-wrapper .first-dropdown::before,
.desktop-main-menu-wrapper::before {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: none !important;
}



.m2-header-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.m2-logo img {
  max-height: 48px;
  width: auto;
  object-fit: contain;
}

.m2-search-box {
  flex: 1;
  max-width: 600px;
  position: relative;
}

.m2-search-input {
  width: 100%;
  height: 46px;
  border-radius: 30px;
  border: 1.5px solid #d9e2ec;
  padding: 0 45px 0 45px;
  font-size: 14px;
  font-family: inherit;
  transition: all 0.25s ease;
  background-color: #f8fafc;
}

.m2-search-input:focus {
  border-color: var(--m2-blue);
  background-color: #ffffff;
  outline: none;
  box-shadow: 0 0 0 4px rgba(0, 114, 188, 0.12);
}

.m2-search-icon,
.m2-mic-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: var(--m2-text-muted);
  font-size: 17px;
  cursor: pointer;
}

.m2-search-icon {
  left: 18px;
}

.m2-mic-icon {
  right: 18px;
}

/* ================= 1. Full-Width Edge-to-Edge Hero Slider ================= */
.m2-hero-section {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 25px 0 !important;
  padding: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background: #0c233c;
}

.m2-hero-swiper {
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

.m2-hero-swiper .swiper-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  transition-property: transform !important;
  box-sizing: content-box !important;
}

.m2-hero-swiper .swiper-slide {
  flex-shrink: 0 !important;
  width: 100% !important;
  height: auto !important;
  position: relative !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.m2-hero-slide-link {
  display: block !important;
  width: 100% !important;
  line-height: 0 !important;
  text-decoration: none !important;
}

.m2-hero-img {
  width: 100% !important;
  height: auto !important;
  min-height: 520px !important;
  max-height: 650px !important;
  display: block !important;
  object-fit: cover !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* Swiper Navigation Arrows */
.m2-hero-prev,
.m2-hero-next {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.22) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #0c233c !important;
  transition: all 0.25s ease !important;
  cursor: pointer !important;
  z-index: 20 !important;
  margin-top: -23px !important;
}

.m2-hero-prev:hover,
.m2-hero-next:hover {
  background: #0072bc !important;
  color: #ffffff !important;
  transform: scale(1.1) !important;
  box-shadow: 0 6px 20px rgba(0, 114, 188, 0.4) !important;
}

.m2-hero-prev {
  right: 25px !important;
}

.m2-hero-next {
  left: 25px !important;
}

.m2-hero-prev::after,
.m2-hero-next::after {
  font-size: 19px !important;
  font-weight: 800 !important;
}

/* Swiper Pagination Bullets */
.m2-hero-pagination {
  bottom: 14px !important;
  z-index: 20 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
}

.m2-hero-pagination .swiper-pagination-bullet {
  width: 10px !important;
  height: 10px !important;
  background: #ffffff !important;
  opacity: 0.65 !important;
  margin: 0 !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
}

.m2-hero-pagination .swiper-pagination-bullet-active {
  width: 30px !important;
  border-radius: 10px !important;
  background: #00a8cc !important;
  opacity: 1 !important;
  box-shadow: 0 2px 8px rgba(0, 168, 204, 0.6) !important;
}

@media (max-width: 768px) {
  .m2-hero-section {
    margin-bottom: 15px !important;
  }

  .m2-hero-prev,
  .m2-hero-next {
    display: none !important;
  }

  .m2-hero-img {
    min-height: unset !important;
    max-height: 350px !important;
  }
}

/* ================= Feature Badges Bar (Luxury Redesign - 5 Items) ================= */
.m2-features-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 22px 0 32px 0;
}

.m2-feature-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 14px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.02);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.m2-feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.09);
  border-color: rgba(0, 114, 188, 0.3);
}

.m2-feature-icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.m2-feature-card:hover .m2-feature-icon {
  transform: scale(1.08);
}

/* 1. كفالة 3 سنوات (Gold / Amber Shield) */
.m2-feat-warranty .m2-feature-icon,
.m2-feature-card:nth-child(1) .m2-feature-icon {
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  color: #d97706;
  border: 1px solid rgba(245, 158, 11, 0.25);
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.15);
}

/* 2. نقاط المكافآت (Purple / Violet Gift) */
.m2-feat-rewards .m2-feature-icon,
.m2-feature-card:nth-child(2) .m2-feature-icon {
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
  color: #7c3aed;
  border: 1px solid rgba(124, 58, 237, 0.25);
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15);
}

/* 3. دعم عبر واتساب (WhatsApp Green) */
.m2-feat-support .m2-feature-icon,
.m2-feature-card:nth-child(3) .m2-feature-icon {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
  color: #16a34a;
  border: 1px solid rgba(22, 163, 74, 0.25);
  box-shadow: 0 4px 12px rgba(22, 163, 74, 0.15);
}

/* 4. توصيل ودفع آمن (Royal Blue Truck) */
.m2-feat-delivery .m2-feature-icon,
.m2-feature-card:nth-child(4) .m2-feature-icon {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  color: #0284c7;
  border: 1px solid rgba(2, 132, 199, 0.25);
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.15);
}

/* 5. استرجاع واستبدال مرن (Rose / Coral Refresh) */
.m2-feat-returns .m2-feature-icon,
.m2-feature-card:nth-child(5) .m2-feature-icon {
  background: linear-gradient(135deg, #fff1f2 0%, #ffe4e6 100%);
  color: #e11d48;
  border: 1px solid rgba(225, 29, 72, 0.25);
  box-shadow: 0 4px 12px rgba(225, 29, 72, 0.15);
}

.m2-feature-info {
  display: flex;
  flex-direction: column;
}

.m2-feature-title {
  font-family: 'Cairo', sans-serif !important;
  font-size: 14px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 2px;
  line-height: 1.3;
  white-space: nowrap;
}

.m2-feature-sub {
  font-family: 'Cairo', sans-serif !important;
  font-size: 11.5px;
  font-weight: 600;
  color: #64748b;
  line-height: 1.3;
  white-space: nowrap;
}

@media (max-width: 1200px) {
  .m2-features-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }
}

@media (max-width: 768px) {
  .m2-features-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin: 15px 0 25px 0;
  }

  .m2-feature-card {
    padding: 12px 12px;
    gap: 10px;
    border-radius: 12px;
  }

  .m2-feature-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 17px;
  }

  .m2-feature-title {
    font-size: 13px;
  }

  .m2-feature-sub {
    font-size: 10.5px;
  }
}

/* ================= 4 Promo Banners Grid ================= */
.m2-promo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 30px;
}

.m2-promo-item {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--m2-shadow);
  transition: all 0.3s ease;
  background: #ebe6df;
  aspect-ratio: 1 / 1.15;
  display: block;
}

.m2-promo-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.m2-promo-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--m2-shadow-hover);
}

.m2-promo-item:hover img {
  transform: scale(1.03);
}

@media (max-width: 768px) {
  .m2-promo-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

/* ================= Deal of the Day ================= */
.m2-deal-section {
  background: #ffffff !important;
  border: 1px solid var(--m2-border) !important;
  border-radius: 20px !important;
  padding: 18px 20px 20px 20px !important;
  box-shadow: var(--m2-shadow) !important;
  margin-bottom: 30px !important;
}

.m2-deal-header,
.m2-deal-section .m2-module-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 0 !important;
  margin-bottom: 14px !important;
  padding-top: 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.m2-deal-section .module-title,
.m2-deal-section .title {
  margin-top: 0 !important;
  padding-top: 0 !important;
  line-height: 1.2 !important;
}

.m2-deal-title-box h2 {
  font-size: 22px;
  font-weight: 800;
  color: var(--m2-primary);
  margin: 0;
}

.m2-deal-countdown {
  display: flex;
  align-items: center;
  gap: 8px;
}

.m2-countdown-label {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--m2-text-muted);
  margin-left: 6px;
}

.m2-countdown-unit {
  background: #111827;
  color: #ffffff;
  font-size: 15px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 8px;
  min-width: 38px;
  text-align: center;
}

.m2-countdown-colon {
  font-size: 18px;
  font-weight: 900;
  color: #111827;
}

.m2-deal-products-grid {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 8px !important;
  width: 100% !important;
}

/* Strictly enforce Cairo font on deals section */
.m2-deal-section,
.m2-deal-section *:not(.fa):not([class*="fa-"]):not([class*="icon-"]) {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
}

.m2-deal-section .fa,
.m2-deal-section [class*="fa-"] {
  font-family: 'icomoon', 'FontAwesome', 'revicons' !important;
  font-style: normal !important;
}

.m2-product-card {
  background: #ffffff !important;
  border: 1px solid #f0f3f6 !important;
  border-radius: 14px !important;
  padding: 12px 10px !important;
  position: relative !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
  display: flex !important;
  flex-direction: column !important;
  transform: none !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

.m2-product-card:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important;
  transform: none !important;
}

.m2-discount-badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  background: var(--m2-red) !important;
  color: #ffffff !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  padding: 3px 7px !important;
  border-radius: 6px !important;
  z-index: 2 !important;
  line-height: 1.2 !important;
}

.m2-product-img-wrap {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  overflow: hidden !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  padding: 0 !important;
}

.m2-product-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  transition: transform 0.35s ease !important;
}

.m2-product-card:hover .m2-product-img-wrap img {
  transform: scale(1.08) !important;
}

.m2-product-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--m2-text-dark) !important;
  line-height: 1.45 !important;
  height: 38px !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin-bottom: 6px !important;
  text-decoration: none !important;
}

.m2-product-prices {
  margin-top: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding-bottom: 4px !important;
}

.m2-price-old {
  font-size: 11.5px !important;
  color: #94a3b8 !important;
  text-decoration: line-through !important;
}

.m2-price-new {
  font-size: 15.5px !important;
  font-weight: 800 !important;
  color: var(--m2-red) !important;
}

.m2-card-actions {
  margin-top: 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.m2-btn-cart {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 32px !important;
  background: linear-gradient(135deg, #0f2c4c 0%, #0072bc 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 16px !important;
  padding: 0 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.m2-btn-cart:hover {
  background: linear-gradient(135deg, #0072bc 0%, #00a8cc 100%) !important;
  color: #ffffff !important;
}

.m2-btn-cart i {
  font-size: 11px !important;
  line-height: 1 !important;
}

.m2-btn-cart span {
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Perfect Circular Wishlist and Compare Buttons */
.m2-btn-wishlist,
.m2-btn-compare {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  flex: 0 0 32px !important;
  flex-shrink: 0 !important;
  border-radius: 50% !important;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #64748b !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  outline: none !important;
}

.m2-btn-wishlist::before,
.m2-btn-wishlist::after,
.m2-btn-compare::before,
.m2-btn-compare::after {
  display: none !important;
  content: none !important;
}

.m2-btn-wishlist:hover {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  color: #ef4444 !important;
}

.m2-btn-compare:hover {
  background: #e0f2fe !important;
  border-color: #7dd3fc !important;
  color: #0284c7 !important;
}

.m2-btn-wishlist i,
.m2-btn-compare i {
  font-size: 12px !important;
  line-height: 1 !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 1200px) {
  .m2-deal-products-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }
}

@media (max-width: 768px) {
  .m2-deal-products-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    padding: 0 !important;
  }
}

/* ================= BNPL & Side Banners Combo ================= */
.m2-bnpl-combo-section {
  display: flex !important;
  align-items: stretch !important;
  gap: 14px !important;
  margin-top: 15px !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.m2-bnpl-combo-section::before,
.m2-bnpl-combo-section::after {
  display: none !important;
  content: none !important;
}

.m2-bnpl-main {
  flex: 7 !important;
  min-width: 0 !important;
  display: flex !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.m2-bnpl-banner-link {
  display: block !important;
  width: 100% !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
  background: transparent !important;
  transform: none !important;
  transition: transform 0.25s ease !important;
}

.m2-bnpl-banner-link:hover {
  transform: translateY(-2px) !important;
}

.m2-bnpl-banner-link img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  display: block !important;
  border-radius: 10px !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

.m2-bnpl-stacked {
  flex: 3 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  align-self: stretch !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.m2-stacked-banner-link {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
  background: transparent !important;
  transform: none !important;
  transition: transform 0.25s ease !important;
}

.m2-stacked-banner-link:hover {
  transform: translateY(-2px) !important;
}

.m2-stacked-banner-link img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: fill !important;
  /* كاملة 100% داخل الكرت بالمللي: مستحيل يتقص منها أي جزء ومستحيل يظهر أي فراغ أبيض */
  object-position: center !important;
  display: block !important;
  border-radius: 10px !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

@media (max-width: 991px) {
  .m2-bnpl-combo-section {
    flex-direction: column !important;
    gap: 12px !important;
  }

  .m2-bnpl-stacked {
    flex-direction: row !important;
    gap: 10px !important;
  }

  .m2-stacked-banner-link {
    height: 160px !important;
  }
}

@media (max-width: 576px) {
  .m2-bnpl-stacked {
    flex-direction: column !important;
    gap: 10px !important;
  }

  .m2-stacked-banner-link {
    height: 130px !important;
  }
}

/* ================= Full-Width Intermediate Promotional Banners (بين سكاشن المنتجات) ================= */
.m2-fullwidth-banner-section {
  width: 100% !important;
  max-width: 100% !important;
  margin: 30px 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
}

.m2-fullwidth-banner-link {
  display: block !important;
  width: 100% !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  border: 1px solid #eef2f6 !important;
  box-shadow: 0 4px 18px rgba(15, 44, 76, 0.05) !important;
  background: transparent !important;
  text-decoration: none !important;
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.m2-fullwidth-banner-link:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 28px rgba(0, 114, 188, 0.14) !important;
  border-color: #cbd5e1 !important;
}

.m2-fullwidth-banner-link img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 18px !important;
  border: none !important;
  outline: none !important;
}

@media (max-width: 768px) {
  .m2-fullwidth-banner-section {
    margin: 18px 0 !important;
  }

  .m2-fullwidth-banner-link,
  .m2-fullwidth-banner-link img {
    border-radius: 12px !important;
  }
}

/* ================= Hide Old Layout Sliders Only ================= */
#mobile2000-home .module-master_slider,
#mobile2000-home .module-slider,
#mobile2000-home .module-fullscreen_slider,
#mobile2000-home .module-layer_slider,
#mobile2000-home .master-slider,
#mobile2000-home .journal-slider,
#mobile2000-home .rev_slider {
  display: none !important;
}


/* ================= Mobile Bottom Bar ================= */
.m2-mobile-bottom-bar {
  display: none;
}

@media (max-width: 768px) {
  .m2-mobile-bottom-bar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.06);
    z-index: 9999;
    justify-content: space-around;
    align-items: center;
  }

  .m2-bottom-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #64748b;
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 600;
    gap: 3px;
  }

  .m2-bottom-nav-item i,
  .m2-bottom-nav-item svg {
    font-size: 20px;
    width: 20px;
    height: 20px;
  }

  .m2-bottom-nav-item.active {
    color: var(--m2-blue);
  }

  body {
    padding-bottom: 65px;
  }
}

/* ================= Clean Legacy Broken Modules & Polish Products ================= */
.layout-top .module-master_slider,
.layout-top .module-banners,
.layout-bottom .module-banners,
.module-banners-355,
.module-banners-356,
.module-banners-357,
.module-banners-358,
.module-banners-384,
.module-banners-372,
.module-grid-334,
.grid-row-5,
.module-button,
.layout-top .module-button,
.layout-bottom .module-button,
.m2-native-products-wrap .module-button {
  display: none !important;
}

/* Eliminate Gap and Hidden Separators Between 3 Images (BNPL) and Products (جديد) */
.m2-native-products-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.m2-native-products-wrap .layout-top {
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide all phantom empty rows, separators, sliders, dividers before products */
.m2-native-products-wrap .layout-top .grid-row:has(.master-slider),
.m2-native-products-wrap .layout-top .grid-row:has(.rev_slider),
.m2-native-products-wrap .layout-top .grid-row:has(.journal-slider),
.m2-native-products-wrap .layout-top .grid-row-1,
.m2-native-products-wrap .layout-top .module-separator,
.m2-native-products-wrap .layout-top .module-divider,
.m2-native-products-wrap .layout-top hr,
.m2-native-products-wrap .layout-top .divider,
.m2-native-products-wrap .layout-top .separator {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.m2-native-products-wrap .layout-top .grid-row:not(:has(.product-layout)):not(:has(.module-products)):not(:has(.module-categories)):not(:has(.module-manufacturers)):not(:has(.module-blog_posts)) {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.m2-native-products-wrap #common-home,
.m2-native-products-wrap #content,
.m2-native-products-wrap .grid-rows,
.m2-native-products-wrap .grid-row:first-child,
.m2-native-products-wrap .grid-cols,
.m2-native-products-wrap .grid-col {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.m2-native-products-wrap .module-products {
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-bottom: -25px !important;
}

.m2-native-products-wrap .module-products .m2-module-header {
  margin-top: 15px !important;
  padding-top: 0 !important;
  margin-bottom: 12px !important;
}

/* ================= 5 Products Per Row on Desktop & Polished Product Cards ================= */
@media (min-width: 1200px) {

  .product-grid .product-layout,
  .m2-native-products-wrap .product-grid .product-layout,
  .m2-native-products-wrap .swiper-slide.product-layout,
  .module-products .swiper-slide.product-layout,
  .module-products .product-grid .product-layout {
    width: 19.4% !important;
    max-width: 19.4% !important;
    flex: 0 0 19.4% !important;
    margin: 0 0.3% 14px 0.3% !important;
    box-sizing: border-box !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {

  .product-grid .product-layout,
  .m2-native-products-wrap .product-grid .product-layout,
  .m2-native-products-wrap .swiper-slide.product-layout,
  .module-products .swiper-slide.product-layout,
  .module-products .product-grid .product-layout {
    width: 25% !important;
    max-width: 25% !important;
    flex: 0 0 25% !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {

  .product-grid .product-layout,
  .m2-native-products-wrap .product-grid .product-layout,
  .m2-native-products-wrap .swiper-slide.product-layout,
  .module-products .swiper-slide.product-layout,
  .module-products .product-grid .product-layout {
    width: 33.333% !important;
    max-width: 33.333% !important;
    flex: 0 0 33.333% !important;
  }
}

@media (max-width: 767px) {

  .product-grid .product-layout,
  .m2-native-products-wrap .product-grid .product-layout,
  .m2-native-products-wrap .swiper-slide.product-layout,
  .module-products .swiper-slide.product-layout,
  .module-products .product-grid .product-layout {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
    padding: 6px !important;
  }
}

/* Cairo Font Across All Products, Headings, Categories & Articles */
.module-products,
.module-products *,
.product-layout,
.product-layout *,
.module-categories,
.module-categories *,
.module-blog_posts,
.module-blog_posts *,
.post-layout,
.post-layout * {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
}

/* Retain Icon Fonts Inside Product Buttons */
.product-layout .fa,
.product-layout [class*="fa-"],
.product-layout [class*="icon-"],
.module-products .fa,
.module-products [class*="icon-"] {
  font-family: 'icomoon', 'FontAwesome' !important;
}

/* Modern Category & Section Headings */
.m2-module-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  margin: 30px 0 16px 0 !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid #eef2f6 !important;
  position: relative !important;
}

.m2-deal-section .m2-module-header {
  margin: 0 0 12px 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.m2-module-header .module-title,
.m2-module-header .title,
.module-products .module-title,
.module-products .title,
.module-categories .title,
.module-blog_posts .title,
.m2-native-products-wrap .title {
  font-size: 21px !important;
  font-weight: 800 !important;
  color: #0f2c4c !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
}

.m2-view-all-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #0072bc !important;
  background: #f0f7ff !important;
  padding: 6px 18px !important;
  border-radius: 20px !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
  border: 1px solid rgba(0, 114, 188, 0.15) !important;
}

.m2-view-all-link:hover {
  background: #0072bc !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 114, 188, 0.2) !important;
}

.m2-view-all-link i {
  font-size: 14px !important;
}

/* Ensure Product Grids have exactly 1 Row of cards matching Deals section */
@media (min-width: 1200px) {
  .product-grid:not(.swiper-wrapper) {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 10px !important;
  }

  .product-grid:not(.swiper-wrapper)>.product-layout {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
  }

  /* Strictly 1 row on Desktop (hide beyond 6th product) */
  .m2-native-products-wrap .product-grid:not(.swiper-wrapper)>.product-layout:nth-child(n+7) {
    display: none !important;
  }
}

@media (max-width: 1199px) and (min-width: 992px) {
  .product-grid:not(.swiper-wrapper) {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
  }

  /* Strictly 1 row on Large Tablet (hide beyond 4th product) */
  .m2-native-products-wrap .product-grid:not(.swiper-wrapper)>.product-layout:nth-child(n+5) {
    display: none !important;
  }
}

@media (max-width: 991px) and (min-width: 576px) {
  .product-grid:not(.swiper-wrapper) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }

  /* Strictly 1 row on Small Tablet (hide beyond 3rd product) */
  .m2-native-products-wrap .product-grid:not(.swiper-wrapper)>.product-layout:nth-child(n+4) {
    display: none !important;
  }
}

@media (max-width: 575px) {
  .product-grid:not(.swiper-wrapper) {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }

  /* Strictly 1 row on Mobile (hide beyond 2nd product) */
  .m2-native-products-wrap .product-grid:not(.swiper-wrapper)>.product-layout:nth-child(n+3) {
    display: none !important;
  }
}

/* Modern Card Design Matching Deals Section Exactly */
.product-layout .product-thumb {
  background: #ffffff !important;
  border: 1px solid #f0f3f6 !important;
  border-radius: 14px !important;
  padding: 12px 10px !important;
  margin-bottom: 16px !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  transform: none !important;
  box-sizing: border-box !important;
}

.product-layout .product-thumb:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important;
  transform: none !important;
}

.product-layout .product-thumb .image {
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 12px !important;
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
}

.product-layout .product-thumb .image .product-img,
.product-layout .product-thumb .image .image-wrapper {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.product-layout .product-thumb .image img,
.product-layout .product-thumb .image .image-wrapper img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  transition: transform 0.35s ease !important;
}

/* الزووم يحدث فقط على صورة المنتج بدقة ونعومة */
.product-layout .product-thumb:hover .image img,
.product-layout .product-thumb:hover .image .image-wrapper img {
  transform: scale(1.08) !important;
}

.product-layout .name a {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  line-height: 1.5 !important;
  height: 38px !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
  margin-bottom: 6px !important;
}

.product-layout .name a:hover {
  color: #0072bc !important;
}

.product-layout .price {
  margin-top: auto !important;
  padding-top: 8px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.product-layout .price-new {
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #e53935 !important;
}

.product-layout .price-old {
  font-size: 12px !important;
  color: #94a3b8 !important;
  text-decoration: line-through !important;
}

.product-layout .price-normal {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #0f2c4c !important;
}

/* Ensure Buttons Stay Firmly Inside Product Cards with Zero Flyout/Side Popups */
.product-layout .buttons-wrapper,
.product-layout:hover .buttons-wrapper,
.product-layout .product-thumb:hover .buttons-wrapper,
.product-layout .caption .buttons-wrapper {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: 100% !important;
  margin: 10px 0 0 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.product-layout .button-group,
.product-layout:hover .button-group,
.product-layout .product-thumb:hover .button-group {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  justify-content: space-between !important;
  width: 100% !important;
  box-shadow: none !important;
  background: transparent !important;
}

.product-layout .button-group .cart-group,
.product-layout:hover .button-group .cart-group,
.product-layout .product-thumb:hover .button-group .cart-group {
  flex: 1 !important;
  display: flex !important;
  position: static !important;
  transform: none !important;
}

.product-layout .button-group .cart-group .stepper {
  display: none !important;
}

/* Polished Add to Cart Button (اضف للسله) - Fixed Inside Card */
.product-layout .button-group .cart-group .btn-cart {
  width: 100% !important;
  background: linear-gradient(135deg, #0f2c4c 0%, #0072bc 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 25px !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-shadow: 0 2px 6px rgba(0, 114, 188, 0.2) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  position: static !important;
  transform: none !important;
  transition: all 0.25s ease !important;
}

.product-layout .button-group .cart-group .btn-cart:hover {
  background: linear-gradient(135deg, #0072bc 0%, #00a8cc 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0, 168, 204, 0.3) !important;
}

/* Polished Wishlist & Compare Buttons - Fixed Inside Card */
.product-layout .button-group .wish-group,
.product-layout:hover .button-group .wish-group,
.product-layout .product-thumb:hover .button-group .wish-group {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  position: static !important;
  transform: none !important;
}

.product-layout .button-group .wish-group .btn-wishlist,
.product-layout .button-group .wish-group .btn-compare {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 50% !important;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  position: static !important;
  transform: none !important;
  font-size: 13px !important;
}

/* Eliminate duplicate pseudo-element icon so exactly ONE clean icon appears */
.product-layout .button-group .wish-group .btn-wishlist::before,
.product-layout .button-group .wish-group .btn-compare::before {
  content: none !important;
  display: none !important;
}

.product-layout .button-group .wish-group .btn-wishlist:hover {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  color: #ef4444 !important;
  transform: scale(1.08) !important;
}

.product-layout .button-group .wish-group .btn-compare:hover {
  background: #e0f2fe !important;
  border-color: #7dd3fc !important;
  color: #0284c7 !important;
  transform: scale(1.08) !important;
}

/* Hide annoying side popup tooltips and extra buttons on product cards */
.product-layout .tooltip,
.cart-tooltip,
.wishlist-tooltip,
.compare-tooltip,
.product-layout .extra-group,
.product-layout .compare-group {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ================= Swiper Carousel Navigation Arrows (Centered Vertically on Product Cards) ================= */
.swiper {
  position: relative !important;
}

.swiper-buttons,
.m2-native-products-wrap .swiper-buttons,
.module-products .swiper-buttons {
  position: absolute !important;
  width: 100% !important;
  left: 0 !important;
  top: 40% !important;
  /* Centered in the middle of the product cards */
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  z-index: 25 !important;
  margin: 0 !important;
}

.swiper-buttons>div,
.swiper-button-prev,
.swiper-button-next,
.m2-native-products-wrap .swiper-button-prev,
.m2-native-products-wrap .swiper-button-next,
.module-products .swiper-button-prev,
.module-products .swiper-button-next {
  position: absolute !important;
  top: 0 !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  width: 44px !important;
  height: 44px !important;
  background: #ffffff !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 16px rgba(15, 44, 76, 0.15) !important;
  color: #0f2c4c !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  pointer-events: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

/* On hover over the carousel row, reveal the arrows smoothly */
.swiper:hover .swiper-buttons>div,
.swiper:hover .swiper-button-prev,
.swiper:hover .swiper-button-next,
.module-products:hover .swiper-button-prev,
.module-products:hover .swiper-button-next {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Identical Geometric Vector Chevrons for Both Buttons */
.swiper-buttons>div::before,
.swiper-button-prev::before,
.swiper-button-next::before {
  content: "" !important;
  display: block !important;
  width: 11px !important;
  height: 11px !important;
  border-top: 2.5px solid currentColor !important;
  border-right: 2.5px solid currentColor !important;
  background: transparent !important;
  font-family: inherit !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transition: transform 0.2s ease, border-color 0.2s ease !important;
}

/* Button on the right side of screen (points right >) */
.swiper-button-prev,
.module-products .swiper-button-prev {
  right: -12px !important;
  left: auto !important;
}

.swiper-button-prev::before,
.swiper-buttons>div.swiper-button-prev::before {
  transform: rotate(45deg) !important;
  margin-left: -3px !important;
  margin-right: 0 !important;
}

/* Button on the left side of screen (points left <) */
.swiper-button-next,
.module-products .swiper-button-next {
  left: -12px !important;
  right: auto !important;
}

.swiper-button-next::before,
.swiper-buttons>div.swiper-button-next::before {
  transform: rotate(-135deg) !important;
  margin-right: -3px !important;
  margin-left: 0 !important;
}

.swiper-buttons>div:hover,
.swiper-button-prev:hover,
.swiper-button-next:hover {
  background: #0072bc !important;
  color: #ffffff !important;
  border-color: #0072bc !important;
  transform: translateY(-50%) scale(1.1) !important;
  box-shadow: 0 6px 20px rgba(0, 114, 188, 0.35) !important;
}

/* Articles / Blog Section - Polish & Preserve All Content */
.module-blog_posts {
  margin-top: 30px !important;
}

.module-blog_posts .post-layout {
  border-radius: 16px !important;
  background: #ffffff !important;
  border: 1px solid #eef2f6 !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(15, 44, 76, 0.03) !important;
  transition: all 0.25s ease !important;
  padding: 14px !important;
}

.module-blog_posts .post-layout:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 8px 24px rgba(15, 44, 76, 0.09) !important;
  transform: translateY(-3px) !important;
}

.post-layout .post-title a {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.post-layout .post-title a:hover {
  color: #0072bc !important;
}

/* Ensure Bottom Layout (Brands Section above Footer) takes 100% full width matching homepage */
.grid-rows.bottom,
.layout-bottom,
.bottom.grid-rows,
.common-home .grid-rows.bottom {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
}

@media (min-width: 1600px) {

  .grid-rows.bottom,
  .layout-bottom,
  .bottom.grid-rows,
  .common-home .grid-rows.bottom {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
}

@media (max-width: 1199px) {

  .grid-rows.bottom,
  .layout-bottom,
  .bottom.grid-rows,
  .common-home .grid-rows.bottom {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media (max-width: 768px) {

  .grid-rows.bottom,
  .layout-bottom,
  .bottom.grid-rows,
  .common-home .grid-rows.bottom {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

.grid-rows.bottom .container,
.grid-rows.bottom .grid-row,
.grid-rows.bottom .grid-cols,
.grid-rows.bottom .grid-col,
.grid-rows.bottom .grid-items,
.grid-rows.bottom .module,
.layout-bottom .container,
.layout-bottom .grid-row,
.layout-bottom .grid-cols,
.layout-bottom .grid-col,
.layout-bottom .grid-items,
.layout-bottom .module {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* ================= Explicit Reset for Mega Menu "ماركات" in Desktop Header ================= */
.site-wrapper .desktop-main-menu-wrapper .mega-menu .module-manufacturers,
.site-wrapper .desktop-main-menu-wrapper .module-manufacturers {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-top: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

.site-wrapper .desktop-main-menu-wrapper .mega-menu .module-manufacturers .m2-brands-title,
.site-wrapper .desktop-main-menu-wrapper .module-manufacturers .m2-brands-title {
  display: none !important;
}

/* ================= Luxury Uniform Brand Cards Section (أشهر الماركات فوق الفوتر) ================= */
.m2-native-products-wrap .module-manufacturers,
.layout-bottom .module-manufacturers,
.grid-rows.bottom .module-manufacturers {
  width: 100% !important;
  max-width: 100% !important;
  margin: 35px 0 28px 0 !important;
  padding: 26px 24px 22px 24px !important;
  background: #ffffff !important;
  border-radius: 20px !important;
  border: 1px solid #eef2f6 !important;
  border-top: 3.5px solid #0072bc !important;
  box-shadow: 0 6px 24px rgba(15, 44, 76, 0.05) !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* Header: Icon, Bold Title, and Trust Subtitle */
.layout-bottom .module-manufacturers .m2-brands-title,
.grid-rows.bottom .module-manufacturers .m2-brands-title,
.m2-native-products-wrap .module-manufacturers .m2-brands-title {
  margin: 0 0 18px 0 !important;
  padding: 0 0 16px 0 !important;
  border-bottom: 1px solid #edf2f7 !important;
}

.layout-bottom .module-manufacturers .m2-brands-title-row,
.grid-rows.bottom .module-manufacturers .m2-brands-title-row,
.m2-native-products-wrap .module-manufacturers .m2-brands-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.layout-bottom .module-manufacturers .m2-brands-icon,
.grid-rows.bottom .module-manufacturers .m2-brands-icon,
.m2-native-products-wrap .module-manufacturers .m2-brands-icon {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #0072bc 0%, #00a8cc 100%) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  box-shadow: 0 4px 14px rgba(0, 114, 188, 0.28) !important;
}

.layout-bottom .module-manufacturers .m2-brands-title-text,
.grid-rows.bottom .module-manufacturers .m2-brands-title-text,
.m2-native-products-wrap .module-manufacturers .m2-brands-title-text {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.layout-bottom .module-manufacturers .module-title,
.layout-bottom .module-manufacturers .title,
.grid-rows.bottom .module-manufacturers .module-title,
.grid-rows.bottom .module-manufacturers .title,
.m2-native-products-wrap .module-manufacturers .module-title,
.m2-native-products-wrap .module-manufacturers .title {
  font-family: 'Cairo', sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0d2137 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
}

.layout-bottom .module-manufacturers .m2-brands-subtitle,
.grid-rows.bottom .module-manufacturers .m2-brands-subtitle,
.m2-native-products-wrap .module-manufacturers .m2-brands-subtitle {
  font-family: 'Cairo', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  margin-top: 2px !important;
  display: block !important;
}

/* Zero unnecessary gaps & smooth flex alignments */
.layout-bottom .module-manufacturers .module-body,
.layout-bottom .module-manufacturers .swiper-container,
.layout-bottom .module-manufacturers .swiper-wrapper,
.layout-bottom .module-manufacturers .manufacturer-grid,
.m2-native-products-wrap .module-manufacturers .module-body,
.m2-native-products-wrap .module-manufacturers .swiper-container,
.m2-native-products-wrap .module-manufacturers .swiper-wrapper,
.m2-native-products-wrap .module-manufacturers .manufacturer-grid {
  margin: 0 !important;
  padding: 4px 0 !important;
  display: flex !important;
  align-items: center !important;
}

/* Brand Cards Layout */
.layout-bottom .module-manufacturers .swiper-slide,
.layout-bottom .module-manufacturers .manufacturer-layout,
.m2-native-products-wrap .module-manufacturers .swiper-slide,
.m2-native-products-wrap .module-manufacturers .manufacturer-layout {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 10px !important;
  box-sizing: border-box !important;
}

/* ENLARGED Brand Cards inside the bottom section */
.layout-bottom .module-manufacturers .manufacturer-thumb,
.grid-rows.bottom .module-manufacturers .manufacturer-thumb,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb {
  width: 100% !important;
  height: 110px !important;
  min-height: 110px !important;
  max-height: 110px !important;
  background: #ffffff !important;
  border: 1.5px solid #edf2f7 !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 8px rgba(15, 44, 76, 0.03) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
  padding: 14px 22px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.layout-bottom .module-manufacturers .manufacturer-thumb:hover,
.grid-rows.bottom .module-manufacturers .manufacturer-thumb:hover,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb:hover {
  background: #ffffff !important;
  border-color: #0072bc !important;
  box-shadow: 0 8px 24px rgba(0, 114, 188, 0.16) !important;
  transform: translateY(-4px) !important;
}

.layout-bottom .module-manufacturers .manufacturer-thumb .image,
.layout-bottom .module-manufacturers .manufacturer-thumb .image a,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb .image,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb .image a {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  line-height: 0 !important;
  text-decoration: none !important;
}

/* ENLARGED, CRISP BRAND LOGOS inside cards */
.layout-bottom .module-manufacturers .manufacturer-thumb .image img,
.grid-rows.bottom .module-manufacturers .manufacturer-thumb .image img,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb .image img {
  max-width: 155px !important;
  max-height: 68px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: contrast(1.05) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.03)) !important;
  transition: transform 0.25s ease !important;
}

.layout-bottom .module-manufacturers .manufacturer-thumb:hover .image img,
.grid-rows.bottom .module-manufacturers .manufacturer-thumb:hover .image img,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb:hover .image img {
  transform: scale(1.08) !important;
}

/* Hide brand text captions */
.layout-bottom .module-manufacturers .manufacturer-thumb .caption,
.m2-native-products-wrap .module-manufacturers .manufacturer-thumb .caption {
  display: none !important;
}

/* Text fallback when no logo image is available */
.layout-bottom .module-manufacturers .m2-brand-text-fallback,
.m2-native-products-wrap .module-manufacturers .m2-brand-text-fallback {
  font-family: 'Cairo', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0f2c4c !important;
  text-align: center !important;
  line-height: 1.2 !important;
}

/* Swiper Navigation Carousel Arrows */
.layout-bottom .module-manufacturers .swiper,
.m2-native-products-wrap .module-manufacturers .swiper {
  position: relative !important;
  padding: 0 4px !important;
}

/* Swiper Navigation Carousel Arrows - Completely Hidden on Hover & Default */
.layout-bottom .module-manufacturers .swiper-buttons,
.layout-bottom .module-manufacturers .swiper-button-prev,
.layout-bottom .module-manufacturers .swiper-button-next,
.grid-rows.bottom .module-manufacturers .swiper-buttons,
.grid-rows.bottom .module-manufacturers .swiper-button-prev,
.grid-rows.bottom .module-manufacturers .swiper-button-next,
.m2-native-products-wrap .module-manufacturers .swiper-buttons,
.m2-native-products-wrap .module-manufacturers .swiper-button-prev,
.m2-native-products-wrap .module-manufacturers .swiper-button-next,
.layout-bottom .module-manufacturers:hover .swiper-button-prev,
.layout-bottom .module-manufacturers:hover .swiper-button-next,
.grid-rows.bottom .module-manufacturers:hover .swiper-button-prev,
.grid-rows.bottom .module-manufacturers:hover .swiper-button-next,
.m2-native-products-wrap .module-manufacturers:hover .swiper-button-prev,
.m2-native-products-wrap .module-manufacturers:hover .swiper-button-next {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {

  .layout-bottom .module-manufacturers,
  .m2-native-products-wrap .module-manufacturers {
    padding: 18px 14px 16px 14px !important;
    border-radius: 14px !important;
    margin: 22px 0 18px 0 !important;
  }

  .layout-bottom .module-manufacturers .m2-brands-icon,
  .m2-native-products-wrap .module-manufacturers .m2-brands-icon {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    font-size: 15px !important;
    border-radius: 10px !important;
  }

  .layout-bottom .module-manufacturers .module-title,
  .layout-bottom .module-manufacturers .title,
  .m2-native-products-wrap .module-manufacturers .module-title,
  .m2-native-products-wrap .module-manufacturers .title {
    font-size: 16px !important;
  }

  .layout-bottom .module-manufacturers .m2-brands-subtitle,
  .m2-native-products-wrap .module-manufacturers .m2-brands-subtitle {
    font-size: 11.5px !important;
  }

  .layout-bottom .module-manufacturers .manufacturer-thumb,
  .m2-native-products-wrap .module-manufacturers .manufacturer-thumb {
    width: 100% !important;
    height: 88px !important;
    min-height: 88px !important;
    max-height: 88px !important;
    padding: 10px 14px !important;
    border-radius: 12px !important;
  }

  .layout-bottom .module-manufacturers .manufacturer-thumb .image img,
  .m2-native-products-wrap .module-manufacturers .manufacturer-thumb .image img {
    max-height: 54px !important;
    max-width: 120px !important;
  }
}


/* ================= Distinct Twenty Five Footer Styles ================= */
.tf-footer {
  margin-top: 40px;
  font-family: inherit;
}

.tf-newsletter-section {
  background: linear-gradient(135deg, #0c233c 0%, #061524 100%);
  color: #ffffff;
  padding: 38px 0;
  border-top: 3px solid #00a8cc;
}

.tf-newsletter-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  flex-wrap: wrap;
}

.tf-newsletter-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(0, 168, 204, 0.2);
  color: #3fc1c9;
  padding: 5px 14px;
  border-radius: 20px;
  font-size: 12.5px;
  font-weight: 700;
  margin-bottom: 10px;
  line-height: 1;
}

.tf-newsletter-badge svg,
.tf-badge-star {
  display: block;
  flex-shrink: 0;
  margin: 0;
}

.tf-newsletter-badge span {
  display: inline-block;
  line-height: 1;
}

.tf-newsletter-text h3 {
  font-size: 17.5px;
  font-weight: 700;
  margin: 0 0 6px 0;
  color: #ffffff;
  line-height: 1.45;
}

.tf-newsletter-text p {
  margin: 0;
  color: #94a3b8;
  font-size: 13.5px;
}

.tf-newsletter-input-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tf-nl-input {
  width: 320px;
  height: 46px;
  border-radius: 25px;
  border: 1.5px solid #334155;
  background: #1e293b;
  color: #ffffff;
  padding: 0 20px;
  font-family: inherit;
  outline: none;
  font-size: 13.5px;
}

.tf-nl-input:focus {
  border-color: #00a8cc;
}

.tf-nl-btn {
  background: linear-gradient(135deg, #0072bc, #00a8cc);
  color: #ffffff;
  border: none;
  padding: 0 26px;
  height: 46px;
  border-radius: 25px;
  font-weight: 700;
  font-family: inherit;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: transform 0.2s;
}

.tf-nl-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 168, 204, 0.4);
}

.tf-footer-main {
  background: #091a2c;
  color: #94a3b8;
  padding: 48px 0 35px 0;
  font-size: 13.5px;
}

.tf-footer-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.1fr 1.4fr 1.3fr;
  gap: 24px;
}

.tf-footer-logo {
  margin-bottom: 12px;
}

.tf-footer-site-logo {
  max-width: 175px;
  height: auto;
  display: block;
  border-radius: 6px;
}

.tf-footer-sub {
  color: #00a8cc;
  font-size: 12px;
  font-weight: 600;
  margin-top: 6px;
}

.tf-about-desc {
  line-height: 1.75;
  margin-bottom: 20px;
  color: #94a3b8;
}

.tf-social-icons {
  display: flex;
  gap: 10px;
}

.tf-social-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #132a42;
  color: #3fc1c9;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 17px;
  transition: all 0.2s ease;
}

.tf-social-btn:hover {
  background: #00a8cc;
  color: #ffffff;
  transform: translateY(-3px);
}

.tf-footer-heading {
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  margin: 0 0 18px 0;
  position: relative;
  padding-bottom: 10px;
}

.tf-footer-heading::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 35px;
  height: 2.5px;
  background: #00a8cc;
  border-radius: 2px;
}

.tf-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.tf-footer-links li a {
  color: #94a3b8;
  text-decoration: none;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  gap: 6px;
}

.tf-footer-links li a:hover {
  color: #3fc1c9;
  transform: translateX(-4px);
}

.tf-contact-item {
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
  align-items: flex-start;
}

.tf-contact-svg {
  flex-shrink: 0;
  margin-top: 3px;
}

.tf-contact-label {
  display: block;
  font-size: 11.5px;
  color: #64748b;
  margin-bottom: 1px;
}

/* Specific Contact Items: Color NEVER changes on mouse hover */
.tf-static-contact,
.tf-static-contact:hover,
.tf-static-contact:focus,
.tf-static-contact:active,
.tf-contact-item a.tf-static-contact,
.tf-contact-item a.tf-static-contact:hover,
.tf-contact-item a.tf-static-contact:focus,
.tf-contact-item a.tf-static-contact:active,
.tf-contact-item span.tf-static-contact,
.tf-contact-item span.tf-static-contact:hover {
  color: #e2e8f0 !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: none !important;
}

.tf-footer-bottom {
  background: #061320;
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 12.5px;
  color: #64748b;
}

.tf-footer-bottom-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
}

.tf-copyright strong {
  color: #f1f5f9;
}

/* 6 Sleek Compact Payment Images */
.tf-payment-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.tf-payment-img {
  width: 58px;
  height: 35px;
  object-fit: contain;
  background: #ffffff;
  border-radius: 5px;
  border: 1px solid #cbd5e1;
  padding: 2px 4px;
  display: inline-block;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: none !important;
  transform: none !important;
  cursor: default !important;
  pointer-events: none !important;
}

.tf-payment-img:hover {
  transform: none !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}


/* Cairo Font for Footer Content (never touching icons) */
.tf-footer,
.tf-footer p,
.tf-footer h1,
.tf-footer h2,
.tf-footer h3,
.tf-footer h4,
.tf-footer a,
.tf-footer span:not(.fa):not([class*="icon"]),
.tf-footer div,
.tf-newsletter-section,
.tf-newsletter-text h3,
.tf-newsletter-text p,
.tf-nl-input,
.tf-nl-btn,
.tf-footer-heading,
.tf-footer-links a,
.tf-contact-val,
.tf-contact-label,
.tf-copyright {
  font-family: 'Cairo', system-ui, -apple-system, sans-serif;
}

/* Newsletter section: Boxed width (NOT full width) */
.tf-newsletter-section .container {
  max-width: 1240px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
}

/* Main footer columns & bottom bar: Full width */
.tf-footer-main .container,
.tf-footer-bottom .container {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 35px !important;
}

/* ================= Column 5: App Download Badges ================= */
.tf-col-apps .tf-app-col-desc {
  line-height: 1.75 !important;
  margin-bottom: 16px !important;
  color: #94a3b8 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

.tf-app-badges-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  align-items: flex-start !important;
  margin-top: 8px !important;
}

.tf-app-row {
  display: block !important;
  width: 100% !important;
}

.tf-app-link {
  display: inline-block !important;
  text-decoration: none !important;
  border-radius: 9px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.tf-app-link:hover {
  transform: translateY(-2px) scale(1.03) !important;
}

.tf-app-badge-img {
  width: 170px !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 8px !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3) !important;
}

.tf-app-link:hover .tf-app-badge-img {
  box-shadow: 0 6px 18px rgba(0, 168, 204, 0.4) !important;
}

@media (max-width: 1199px) {
  .tf-footer-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 25px !important;
  }
}

@media (max-width: 991px) {
  .tf-footer-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 25px !important;
  }
}

@media (max-width: 768px) {

  .tf-footer-main .container,
  .tf-footer-bottom .container {
    padding: 0 15px !important;
  }

  .tf-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 25px !important;
  }

  .tf-top-bar {
    display: none !important;
  }

  .tf-nl-input {
    width: 100% !important;
  }

  .tf-newsletter-inner {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .tf-payment-badges {
    justify-content: center !important;
  }

  .tf-payment-img {
    width: 75px !important;
    height: 42px !important;
  }

  .tf-app-badges-col {
    align-items: flex-start !important;
  }
}

/* ================= Keep Grid Row 1 & 7, Hide 2, 4, 5 ================= */
.m2-native-products-wrap .grid-row-top-2,
.m2-native-products-wrap .grid-row-top-4,
.m2-native-products-wrap .grid-row-top-5 {
  display: none !important;
}